
import { use, Suspense } from 'react';
 
function getPerson(): Promise<{ name: string }> {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve({ name: 'react19之后' });
    }, 1000);
  });
}
 
const personPromise = getPerson();
 
function Person() {
  // use Api 接受传入一个 Promise 作为参数
  const person = use(personPromise);
 
  return <div>userName: {person.name}</div>;
}
 
function App() {
  return (
    <div>
      <p>Hello:</p>
      {/* 同时配合 Suspense 实现使用 use 组件的渲染加载态 */}
      <Suspense fallback={<div>Loading...</div>}>
        <Person />
      </Suspense>
    </div>
  );
}
 
export default App;